<template>
    <div>
        <M-Header></M-Header>
        <div class="w1200 clearfix">
            <c-nav></c-nav>
            <router-view class="child-view"></router-view>
        </div>
    </div>
</template>


<style>
    .child-view {
        min-height: 500px;
    }

    * {
        padding: 0;
        margin: 0;
        list-style: none;
        font-weight: normal;
        outline-style: none;
        text-decoration: none;
        font-size: 14px;
        font-style: normal;
        vertical-align: baseline;
        font-family: "Microsoft Yahei";
        border-collapse: collapse;
        border-spacing: 0;
    }

    .w1200 {
        width: 1200px;
        margin: 0 auto;
    }

    .bgf2f2f2 {
        background-color: #f2f2f2;
    }

    .fr {
        float: right;
    }

    .fl {
        float: left;
    }

    .clearfix:after {
        content: '';
        height: 0;
        line-height: 0;
        visibility: hidden;
        display: block;
        clear: both;
    }

    .clearfix {
        zoom: 1;
    }

    input {
        border: none;
        background-color: #fff;
    }

    .fade-enter-active, .fade-leave-active {
        transition: opacity .5s ease;
    }

    .fade-enter, .fade-leave-active {
        opacity: 0
    }

    .bottom-bar {
        opacity: 1;
        transition: opacity .5s;
    }

    .slide-left-enter, .slide-right-leave-active {
        opacity: 0;
        -webkit-transform: translate(100px, 0);
        transform: translate(100px, 0);
    }

    .slide-left-leave-active, .slide-right-enter {
        opacity: 0;
        -webkit-transform: translate(-100px, 0);
        transform: translate(-100px, 0);
    }

    .fade-enter-to, .slide-left-enter-to .bottom-bar {
        opacity: 0;
    }

    .aside-right {
        min-height: 620px;
        width: 976px;
        box-sizing: border-box;
        background-color: #fff;
        padding: 30px;
        position: relative;
        border-radius: 10px;
        padding-bottom: 80px;
        box-shadow: 0px 0px 8px 0px #dadada;
    }

    .aside-right .el-table {
        min-height: 450px;
    }

    .el-table {
        max-height: 500px;
        overflow: scroll;
    }

    *.el-button--text {
        color: #00b7ee;
    }

    .aside-right .el-table.not-min {
        min-height: 0;
    }

    .page {
        position: absolute;
        bottom: 20px;
        right: 50px;
    }

    .child-view {
        /*position: absolute;*/
        transition: all .5s cubic-bezier(.55, 0, .1, 1);
    }

    .el-loading-mask {
        z-index: 999;
    }

    @font-face {
        font-family: 'iconfont';
        /*src: url('../assets/font/iconfont.eot');*/
        /*src: url('../assets/font/iconfont.eot?#iefix') format('embedded-opentype'),*/
        /*url('../assets/font/iconfont.woff') format('woff'),*/
        /*url('../assets/font/iconfont.ttf') format('truetype'),*/
        /*url('../assets/font/iconfont.svg#iconfont') format('svg');*/
    }

    .iconfont {
        font-family: "iconfont" !important;
        font-size: 16px;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        -webkit-text-stroke-width: 0.2px;
        -moz-osx-font-smoothing: grayscale;
    }
</style>

<script>
    import MHeader from '@/components/Head'
    import CNav from '@/components/Nav'

    export default {
        data() {
            return {}
        },
        components: {
            MHeader,
            CNav
        }
    }
</script>